<!--
 * @Author: wangming
 * @Date: 2021-05-29 14:10:30
 * @LastEditors: wangming
 * @LastEditTime: 2022-06-24 16:57:19
 * @Description: file content
-->
<template>
  <div>
    <el-form-item label="标题" class="tr" prop="title">
      <div class="table-title-config">
        <GlobalizationConfigWord
          class="mr10"
          @setLangCode="
            (title_i18n) => $set(value.__config, 'tableTitle_i18n', title_i18n)
          "
          :localism="value.__config.tableTitle_i18n"
        ></GlobalizationConfigWord>
        <el-switch v-model="value.__config.tableTitle" />
      </div>
      <el-input
        v-if="value.__config.tableTitle"
        v-model="value.__config.tableTitleContent"
        maxlength="128"
        size="small"
      ></el-input>
    </el-form-item>
    <el-form-item label="表格搜索">
      <el-radio-group
        v-model="value.__config.searchStatus"
        @change="searchTypeChange"
      >
        <el-radio-button
          class="mb5 search-radio"
          :key="index"
          :label="i.key"
          v-for="(i, index) in TABLE_SEARCG_ENUM"
          >{{ i.value }}</el-radio-button
        >
      </el-radio-group>
    </el-form-item>
    <hmAssociateSearchCom
      :value="value"
      v-if="value.__config.searchStatus == 3"
    ></hmAssociateSearchCom>
    <el-form-item label="数据选择">
      <el-radio-group v-model="value.__config.selecteStatus">
        <el-radio-button
          :key="index"
          :label="i.key"
          v-for="(i, index) in TABLE_SELECT_ENUM"
          >{{ i.value }}
        </el-radio-button>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="分页">
      <el-radio-group v-model="value.__config.pageStatus">
        <el-radio-button
          :key="index"
          :label="i.key"
          v-for="(i, index) in TABLE_PAGES_ENUM"
          >{{ i.value }}
        </el-radio-button>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="表格序号">
      <el-radio-group v-model="value.__config.indexStatus">
        <el-radio-button
          :key="index"
          :label="i.key"
          v-for="(i, index) in TABLE_INDEX_ENUM"
          >{{ i.value }}
        </el-radio-button>
      </el-radio-group>
    </el-form-item>
    <el-form-item label="行标识" class="tr">
      <el-input
        class="mr10"
        style="width: 160px"
        v-model="value.__config.rowKey"
        placeholder="默认id"
      ></el-input>
    </el-form-item>
    <el-form-item label="自定义表头" class="tr">
      <el-switch v-model="value.__config.customColumn" />
    </el-form-item>
    <el-form-item label="查询缓存" class="tr">
      <el-switch v-model="value.__config.caches" />
    </el-form-item>
    <el-form-item label="统计" class="tr">
      <el-switch v-model="value.__config.showSummary" />
    </el-form-item>
    <el-form-item label="统计方式" v-if="value.__config.showSummary">
      <el-radio-group v-model="value.__config.summaryMethod">
        <el-radio :label="'PAGE'">当前页</el-radio>
        <el-radio :label="'ALL'">全部</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item
      label="表格数据显示树形结构"
      class="tr"
      v-if="value.__config.supportTree"
    >
      <el-switch v-model="value.__config.showTree" />
    </el-form-item>
  </div>
</template>

<script>
import basicmixins from "../basicmixins";
import hmAssociateSearchCom from "../hmAssociateSearchCom.vue";
import {
  TABLE_SEARCG_ENUM,
  TABLE_SELECT_ENUM,
  TABLE_PAGES_ENUM,
  TABLE_INDEX_ENUM,
} from "@/utils/enum";
export default {
  components: {
    hmAssociateSearchCom,
  },
  mixins: [basicmixins],
  watch: {
    "value.__config.showSummary": function (v) {
      if (v) {
        this.value.__config.summaryMethod =
          this.value.__config.summaryMethod || "PAGE";
        let { getEntitymodelList } = this.value.__config;
        this.value.__config.getEntitymodelList = getEntitymodelList.map((i) =>
          Object.assign({}, i, {
            showSummary: false,
            total_unit: "",
            summaryType: "sum",
          })
        );
      }
    },
    "value.__config.modelCode"(newValue, oldValue) {
      newValue != oldValue &&
        this.value.__config.advancedSearchConfig &&
        (this.value.__config.advancedSearchConfig.childrens = []);
    },
  },
  data() {
    return {
      TABLE_SEARCG_ENUM,
      TABLE_SELECT_ENUM,
      TABLE_PAGES_ENUM,
      TABLE_INDEX_ENUM,
    };
  },
  methods: {
    searchTypeChange(event) {
      if (event != 3) this.value.__config.relationSearchCom = "";
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep .el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
  margin-bottom: 10px;
}

::v-deep .search-radio .el-radio-button__inner {
  padding: 5px 10px;
}

.table-title-config {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>
